        <section class="panel map col-md-6">
            <!-- main -->
            <div class="panel-body pd-md">
                <div class="row">
                    <div id="map" style="width: 100%;height:400px;"></div>
                </div>
            </div>
            <!-- main -->
        </section>


<script>
// 随机数据
// var data = [{"name":"北京","value":69},{"name":"天津","value":46},{"name":"河北","value":14},{"name":"山西","value":67},{"name":"内蒙古","value":72},{"name":"辽宁","value":45},{"name":"吉林","value":17},{"name":"黑龙江","value":81},{"name":"上海","value":54},{"name":"江苏","value":77},{"name":"浙江","value":10},{"name":"安徽","value":59},{"name":"福建","value":100},{"name":"江西","value":16},{"name":"山东","value":23},{"name":"河南","value":84},{"name":"湖北","value":84},{"name":"湖南","value":76},{"name":"广东","value":39},{"name":"广西","value":2},{"name":"海南","value":71},{"name":"重庆","value":83},{"name":"四川","value":52},{"name":"贵州","value":26},{"name":"云南","value":40},{"name":"西藏","value":70},{"name":"陕西","value":1},{"name":"甘肃","value":90},{"name":"青海","value":21},{"name":"宁夏","value":35},{"name":"新疆","value":1},{"name":"台湾","value":95},{"name":"香港","value":34},{"name":"澳门","value":59},{"name":"南海诸岛","value":62},{"name":"南海诸岛","value":86}];

  var data = {:json_encode($map_data)};

  // 初始化图表
  new Highcharts.Map('map', {
    title: {
      text: '客户分布图'
    },
    colorAxis: {
      min: 0,
      minColor: '#d8d8d8',
      maxColor: '#2DCB73'
    },
    series: [{
      data: data,
      name: '客户数量',
      mapData: Highcharts.maps['cn/china'],
      // 根据 name 属性进行关联
      joinBy: 'name' 
    }]
  });


</script>